<!DOCTYPE html>
<html lang="ch">
<head>
    <meta charset="UTF-8">
    <title>事件的委托</title>
    <script src="jquery-3.4.1.js"></script>
    <script>
        $(function () {
            $('ul').on('click', 'li', function () {
                // this.style.background = 'red';
                $(this).css("background", "red");
            });
            $('#but1').click(function () {
                $('ul').append('<li>xxxx</li>')
            });
            $('#but2').click(function () {
                $('ul').off('click','li');
            });

        });

    </script>
</head>

<body>
<ul>
    <li>1111</li>
    <li>2222</li>
    <li>3333</li>
</ul>
<button type="button" id="but1">添加</button>
<button type="button" id="but2">取消</button>
</body>
</html>